/*common css*/
$color:#3a3a3a #ff9601 #fff #eeeeee;
$size:12px 14px 16px;
$float-r:right;
$float-l:left;
$position-r:relative;
$position-a:absolute;
/*top css content*/
@mixin decoration($top,$right,$bottom,$left,$width,$height){
  &:before{
    content:"";
    z-index: 1;
    position:$position-a;
    top:$top;
    right:$right;
    bottom: $bottom;
    left:$left;
    width: $width;
    height: $height;
  }
}
.top{
  color:nth( $color,3);
  font-size:nth( $size,1 );
  line-height: 36px;
  background-color:nth( $color,1);

  ul {
      li{
        position: $position-r;
        float: $float-l;
        padding-left: 10px;
        margin-left: 10px;
        @include decoration(50%,auto,auto,0,1px,12px);
        &:before{
          margin-top:-6px;
          background-color:#939393;
        }
        &:first-child{
          &:before{
            height:0;
          }
        }
        a{
          display:block;
          color:#939393;
          font-size:nth( $size,1 );
          &:hover{
            color:nth( $color,3);
          }
          .icon-font{
            font-size:nth($size,2);
          }
        }
        em{
          vertical-align: middle;
        }
      }
  }
}
.navbar{
  background-color:nth($color,3);
  border:none;
}
.navbar-header{
  float: $float-l;
  @at-root{
    .navbar-brand{
      height: auto;
      padding:0;
      margin:0;
    }
  }
}
@mixin stateChange{
  background: nth( $color,2 );
  color: nth( $color,3);
}
.navbar-nav{
  float: $float-r;
  li{
    a{
      display:block;
      padding:0 15px 0 15px;
      font-size: nth( $size,2 );
      line-height:106px;
      color:nth( $color,1);
      &:hover{
        @include stateChange;
      }
    }
    &.active{
      z-index: 0;
      position:$position-r;
      @include decoration(auto,auto,0,50%,0,0);
      &:before{
        margin-left:-10px;
        border:10px solid transparent;
        border-bottom-color:nth($color,3);
      }
      a{
        @include stateChange;
      }
    }
  }
}
.carousel-inner{
  text-align:center;
  .item>img{
    display:inline-block;
  }
}